<%@page import="controller.StudentCtrl"%>
<%@page import="controller.RoundCtrl"%>
<%@page import="entity.Student"%>
<%@page import="entity.Round"%>
<%@ page language="java" contentType="text/html; charset=US-ASCII"
	pageEncoding="US-ASCII"%>

<%@ taglib prefix="stripes"
	uri="http://stripes.sourceforge.net/stripes-dynattr.tld"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>

<stripes:layout-definition>

	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
	<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Merlion University BIOS</title>
<link href="${pageContext.request.contextPath}/assets/css/bootstrap.css"
	rel="stylesheet" type="text/css" />
<link
	href="${pageContext.request.contextPath}/assets/css/bootstrap-theme.css"
	rel="stylesheet" type="text/css" />
<link
	href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css"
	rel="stylesheet" />
<link href="${pageContext.request.contextPath}/assets/css/general.css"
	rel="stylesheet" type="text/css" />
<link href="${pageContext.request.contextPath}/assets/css/navbar.css"
	rel="stylesheet" type="text/css" />
<stripes:layout-component name="head" />
</head>

<body>

	<!-- start of navbar -->
	<div class="navbar navbar-default navbar-fixed-top">
		<div class="container">
			<div class="navbar-header">
				<button type="button" class="navbar-toggle" data-toggle="collapse"
					data-target=".navbar-collapse">
					<span class="icon-bar"></span> <span class="icon-bar"></span> <span
						class="icon-bar"></span>
				</button>
				<a class="navbar-brand" href="${pageContext.request.contextPath}/courses/view"><span>BIOS</span></a>
			</div>
			<div class="navbar-collapse collapse">
				<ul class="nav navbar-nav navbar-right">
					<li
						class="${fn:contains(requestScope['javax.servlet.forward.request_uri'], '/courses/') ? "active" : "" }"><a
						href="${pageContext.request.contextPath}/courses/view"><i
							class="glyphicon glyphicon-th-list"></i> bid courses</a></li>
					<li
						class="${fn:contains(requestScope['javax.servlet.forward.request_uri'], '/timetable/') ? "active" : "" }"><a
						href="${pageContext.request.contextPath}/timetable/view"><i
							class="glyphicon glyphicon-calendar"></i> timetable</a></li>
					<li
						class="${fn:contains(requestScope['javax.servlet.forward.request_uri'], '/bid') ? "active" : "" }"><a
						href="${pageContext.request.contextPath}/bids/view"><i
							class="glyphicon glyphicon-shopping-cart"></i> my bids</a></li>
					<c:set var="completedCourses"
						value="${actionBean.retrieveCompletedCoursesForLoggedInStudent() }" />
					<li><a id="user-info" href="javascript:void(0)"
						data-toggle="popover" title="" data-trigger="manual"
						data-html="true" data-container="body" role="button"
						data-original-title="My Completed Courses" data-placement="bottom"><span
							class="label label-primary"><i
								class="glyphicon glyphicon-user"></i> <span
								style="max-width: 80px; overflow: hidden;">${actionBean.loggedInStudent.name }</span>
								(${actionBean.loggedInStudent.school }) <span
								style="text-transform: lowercase;">(e$${actionBean.toTwoDecimalPlaces(actionBean.loggedInStudent.edollar)
									})</span></span></a></li>

					<li><a id="round-info" href="javascript:void(0)"
						data-toggle="tooltip" data-placement="bottom"
						title="${actionBean.getCurrentRoundDescription() }"><span
							class="label label-${actionBean.isCurrentRoundOpen() ? "success" : "danger"}"><i
								class="glyphicon glyphicon-time"></i> round
								${actionBean.currentRound.roundNo } is
								${actionBean.isCurrentRoundOpen() ? "open" : "closed"}</span></a></li>
					<li><a href="${pageContext.request.contextPath}/logout.jsp"><i
							class="glyphicon glyphicon-log-out"></i> logout</a></li>
				</ul>
			</div>
			<!--/.nav-collapse -->
		</div>
	</div>
	<!-- end of navbar -->

	<div class="container theme-showcase">

		<stripes:layout-component name="content" />

		<!-- 
		<div id="footer">
			&copy; Copyright SE 2013 G7T1. Huiwen. Jaslin. Junming. Safi. Sheryl.
			<a href="#">About Us</a>
		</div>
 		-->
	</div>

	<%@include file="layout/completed-course-popover.jsp"%>

	<!-- Bootstrap core JavaScript -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script
		src="${pageContext.request.contextPath}/assets/js/jquery.min.js"
		type="text/javascript"></script>
	<script
		src="${pageContext.request.contextPath}/assets/js/bootstrap.min.js"
		type="text/javascript"></script>
	<script
		src="${pageContext.request.contextPath}/assets/js/bootbox.min.js"
		type="text/javascript"></script>

	<script type="text/javascript">
		element = $('#user-info');

		var waitAndHide = function() {
			setTimeout(function() {
				if ($(element).data('isPopoverShown') == true
						&& $(element).data('shouldShowPopover') == false) {
					$(element).popover('hide');
					$(element).data('isPopoverShown', false);
				}
			}, 100);
		};

		$(element).popover({
			html : true,
			content : function() {
				return $("#completed-course-popover").html();
			}
		}).on(
				"mouseenter",
				function() {
					$(element).data('shouldShowPopover', true);

					if ($(element).data('isPopoverShown') == undefined
							|| $(element).data('isPopoverShown') == false) {
						$(element).popover("show");
						$(element).data('isPopoverShown', true);
					}

					$('.popover').on("mouseleave", function() {
						$(element).data('shouldShowPopover', false);
						waitAndHide();
					}).on("mouseenter", function() {
						$(element).data('shouldShowPopover', true);
					});

				}).on("mouseleave", function() {
			$(element).data('shouldShowPopover', false);
			waitAndHide();
		});

		$('#round-info').tooltip();
		$('.edollar').tooltip();
	</script>

	<stripes:layout-component name="end" />
</body>
	</html>


</stripes:layout-definition>